<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<script src="http://ajax.microsoft.com/ajax/jquery.validate/1.7/jquery.validate.js"
 	type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
	$("#createUserForm").validate({
		rules: {
			loginId: {
				required: true
			},
			password: {
				required: true
			},
		},
		submitHandler: function(){
	          $("#createUserForm").submit();
	    }
	})
});
</script>
<div class="container">
	<form:form action="adminCreateUser" method="post" role="form" commandName="modelUserForm"
		id="createUserForm">
		<div class="form-group row">
			<label class="col-md-2"> Login Id </label>
			<div class="col-md-6">
				<form:input path="loginId" type="text" class="form-control" id="loginId"
					placeholder="Enter Login Id" />
			</div>
			<div class="myErrors"></div>
			<form:errors path="loginId" />
			<br />
		</div>
		<div class="form-group row">
			<label class="col-md-2"> Password </label>
			<div class="col-md-6">
				<form:input path="password" type="password" class="form-control" id="password"
					placeholder="Enter Password" />
			</div>
			<!-- <div class="myErrors"></div> -->
			<form:errors path="password" />
			<br />
		</div>
		<div class="form-group row">
			<label class="col-md-2"> User State </label>
			<div class="col-md-6">
				<form:select path="userState" class="form-control" id="userState">
					<option value="enabled">Enabled</option>
					<option value="disabled">Disabled</option>
				</form:select>
			</div>
			<br />
		</div>
		<div class="form-group row">
			<label class="col-md-2"> Customer </label>
			<div class="col-md-6">
				<form:select path="customerCardNumberId" class="form-control" id="chosenCustomer">
					<c:forEach var="customer" items="${listCustomer}">
						<option value=${customer.getCardNumberId() }>Card No.Id:
							${customer.getCardNumberId()} | Name: ${customer.getFirstName()}
							${customer.getLastName()}</option>
					</c:forEach>
				</form:select>
			</div>
			<form:errors path="customerCardNumberId" />
			<br />
		</div>
		<div class="row">
			<div class="col-md-2"></div>
			<div class="col-md-10">
				<input type="submit" value="Create User" class="btn btn-primary" />
			</div>
		</div>
	</form:form>
</div>